{% extends 'personalLayout.html' %}
{% load static %}
{% block title %}
    <title>资源上传</title>
{% endblock %}
{% block css %}
    <link rel="stylesheet" href="{% static 'css/uploadResource.css' %}" type="text/css">
{% endblock %}

{% block content %}
        <div class="layout-div">
    <div class="my-form-div">
        <!-- 婚庆公司资源 -->
        <form method="POST" id="company-res-form">
            <div class="card my-card">
                <div class="card-header" style="background-color:#d8e3e9">
                    <h4><i class="fa fa-address-card"></i> 婚庆公司资源上传面板</h4>
                    <span>已有资源数：{{ result.company_total_count }}</span>
                </div>
                <div class="card-body my-card-body">
                    {{ company_form }}
                </div>
            </div>
            <button type="button" class="btn btn-primary" id="company-submit"><i class="fa fa-plus"></i> 确认上传</button>
        </form>
        <!-- 婚庆公司资源 -->
        <!-- 外聘资源 -->
        <form method="POST" id="employee-res-form">
            <div class="card my-card">
                <div class="card-header" style="background-color:#d8e3e9">
                    <h4><i class="fa fa-group"></i> 外聘资源上传面板</h4>
                    <span>已有资源数：{{ result.employee_total_count }}</span>
                </div>
                <div class="card-body my-card-body">
                    {{ employee_form }}
                </div>
            </div>
            <button type="button" class="btn btn-primary" id="employee-submit"><i class="fa fa-plus"></i> 确认上传</button>
        </form>
        <!-- 外聘资源 -->
    </div>
    <div class="my-form-div">
        <!-- 优秀案例 -->
        <form method="POST" id="case-res-form">
            <div class="card my-card">
                <div class="card-header" style="background-color:#d8e3e9">
                    <h4><i class="fa fa-trophy"></i> 优秀案例资源上传面板</h4>
                    <span>已有资源数：{{ result.case_total_count }}</span>
                </div>
                <div class="card-body my-card-body">
                    {{ case_form }}
                </div>
            </div>
            <button type="button" class="btn btn-primary" id="case-submit"><i class="fa fa-plus"></i> 确认上传</button>
        </form>
        <!-- 优秀案例 -->
        <!-- 酒店资源 -->
        <form method="POST" id="hotel-res-form">
            <div class="card my-card">
                <div class="card-header" style="background-color:#d8e3e9">
                    <h4><i class="fa fa-hotel"></i> 酒店资源上传面板</h4>
                    <span>已有资源数：{{ result.hotel_total_count }}</span>
                </div>
                <div class="card-body my-card-body">
                    {{ hotel_form }}
                </div>
            </div>
            <button type="button" class="btn btn-primary" id="hotel-submit"><i class="fa fa-plus"></i> 确认上传</button>
        </form>
        <!-- 酒店资源 -->

    </div>
    <div class="my-form-div">
            <!-- 主页 -->
        <form method="POST" id="index-res-form">
            <div class="card my-card">
                <div class="card-header" style="background-color:#d8e3e9">
                    <h4><i class="fa fa-bookmark"></i> 主页资源上传面板</h4>
                </div>
                <div class="card-body my-card-body">
                    {{ index_form }}
                </div>
            </div>
            <button type="button" class="btn btn-primary" id="index-submit"><i class="fa fa-plus"></i> 确认上传</button>
        </form>
        <!-- 主页 -->
    </div>
        </div>
{% endblock %}
{% block other %}
    <!-- Modal with "fade" in server -->
    <div class="modal" id="upload-msg-Modal" tabindex="-1" aria-labelledby="upload-msg-ModalLabel" aria-hidden="true">
        <div class="modal-dialog">
            <div class="modal-content">
                <div class="modal-header">
                    <h5 class="modal-title" id="upload-msg-ModalLabel">上传提示</h5>
                    <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                        <span aria-hidden="true">&times;</span>
                    </button>
                </div>
                <div class="modal-body">
                    正在上传...请稍后
                </div>
            </div>
        </div>
    </div>
    <!-- Modal -->
    <div class="modal fade" id="upload-success-Modal" tabindex="-1" aria-labelledby="upload-success-ModalLabel"
         aria-hidden="true">
        <div class="modal-dialog">
            <div class="modal-content">
                <div class="alert alert-success" role="alert">
                    <div class="modal-header">
                        <h4 class="alert-heading">上传成功 !</h4>
                        <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                            <span aria-hidden="true">&times;</span>
                        </button>
                    </div>
                    <p>您成功上传了本次的资源！</p>
                </div>
            </div>
        </div>
    </div>

    <div class="modal fade" id="upload-failure-Modal" tabindex="-1" aria-labelledby="upload-failure-ModalLabel"
         aria-hidden="true">
        <div class="modal-dialog">
            <div class="modal-content">
                <div class="alert alert-danger" role="alert">
                    <div class="modal-header">
                        <h4 class="alert-heading">上传失败 !</h4>
                        <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                            <span aria-hidden="true">&times;</span>
                        </button>
                    </div>
                    <p>您可能选用了格式错误的资源，或者您有资源尚未上传，请检查后重试。</p>
                </div>
            </div>
        </div>
    </div>
{% endblock %}
{% block js %}
    <script src="{% static 'js/uploadResource.js' %}"></script>
{% endblock %}
